import { createStyles } from 'antd-style';

/**
 * Transfer 扩展样式 Hook
 * 
 * ⚠️ 此文件仅提供 ConfigProvider 主题系统无法实现的特殊交互效果
 * 
 * 基础样式（颜色、字体、间距、hover/active 状态等）请通过以下方式配置：
 * 1. 修改 DSL 文件 (Transfer.json)
 * 2. 更新主题配置 (themes/transfer.ts)
 * 3. 在应用根组件使用 ConfigProvider 应用主题
 * 
 * @example
 * ```tsx
 * const { styles } = useTransferStyles();
 * <Transfer className={styles.enhanced}>增强效果</Transfer>
 * ```
 */
export const useTransferStyles = createStyles(({ token, css }) => {
  return {
    /**
     * 基础增强样式 - 应用于所有 Transfer 组件
     */
    enhancedTransfer: css`
      /* 基础增强样式 - 应用于所有 Transfer 组件 */
    `,

    /**
     * 增强样式 - 添加过渡效果
     */
    enhanced: css`
      .ant-transfer-list {
        transition: all ${token.motionDurationMid};
      }
    `,

    /**
     * 自定义圆角
     */
    customRadius: css`
      .ant-transfer-list {
        border-radius: ${token.borderRadius}px;
      }
    `,
  };
});

